var A = A || {};
A.root = document.getElementById('container');
console.log(A.root);
// A.strategy = {
// 	'listPart' : function(data){
// 		var s = document.createElement("div"),
// 				h = document.createElement("h2"),
// 				p = document.createElement("p"),
// 				ht = document.createTextNode(data.data.h2),
// 				pt = document.createTextNode(data.data.p),
// 				ul = document.createElement("ul"),
// 				ldata = data.data.li,
// 				li, strong, span, t, c;
// 				data.id && (s.id = data.id);
// 				s.className = "part";
// 				h.appendChild(ht);
// 				p.appendChild(pt);
// 				s.appendChild(h);
// 				s.appendChild(p);
// 				for(var i = 0, len = ldata.length; i < len; i++){
// 					li = document.createElement("li");
// 					strong = document.createElement("strong");
// 					span = document.createElement("span");
// 					t = document.createTextNode(ldata[i].strong);
// 					c = document.createTextNode(ldata[i].span);
// 					strong.appendChild(t);
// 					span.appendChild(c);
// 					li.appendChild(strong);
// 					li.appendChild(span);
// 					ul.appendChild(li);
// 				}
// 				s.appendChild(ul);
// 				A.root.appendChild(s);
// 	},
// 	'codePart' : function(){},
// 	'guide' : function(){}
// }
A.init = function(data){
	this.strategy[data.type](data);
}


A.formateString = function(str, data){
	return str.replace(/\{#(\w+)#\}/g, function(match, key){return typeof data[key] === undefined ? '' : data[key]});
}

A.view = function(name){
	var v = {
		code : '<pre><code>{#code#}</code></pre>',
		img : '<img src="{#src#}" alt="{#alt#}" title="{#title#}"/>',
		part: '<div id="{#id#}" class="{#class#}">{#part#}</div>',
		theme : [
		'<div>',
			'<h1>{#title#}</h1>',
			'{#content#}',
		'</div>'
		].join('')
	}
	if(Object.prototype.toString.call(name) === "[object Array]"){
		var tpl = '';
		for(var i = 0, len =name.length; i < len; i++){
			tpl += arguments.callee(name[i]);
		}
		return tpl;
	}else{
		return v[name] ? v[name] : ('<' + name + '>{#' + name + '#}</' + name + '>');
	}
}


// 'listPart' : function(data){
// 	tpl = A.view(['h2', 'p', 'ul']),
// 	liTpl = A.formateString(A.view('li'), {li : A.view(['strong', 'span'])}),
// }
		console.log(A.view(['h2', 'p', 'ul']));


A.strategy = {
	'listPart' : function(data){
		var s = document.createElement("div"),
				ul = '',
				ldata = data.data.li, //???
		tpl = A.view(['h2', 'p', 'ul']),
		liTpl = A.formateString(A.view('li'), {li : A.view(['strong', 'span'])});
		data.id && (s.id = data.id);
		for(var i = 0, len = ldata.length; i < len; i++){
			if(ldata[i].em || ldata[i].span){
				ul += A.formateString(liTpl, ldata[i]);
			}
		}
		data.data.ul = ul;
		s.innerHTML = A.formateString(tpl, data.data);
		A.root.appendChild(s);
	}
}



A.root.innerHTML =A.strategy.listPart([
]);


